import 'package:appflutterhomeschool/provider/provider_widget.dart';
import 'package:appflutterhomeschool/res/styles.dart';
import 'package:appflutterhomeschool/route/application.dart';
import 'package:appflutterhomeschool/route/routes.dart';
import 'package:appflutterhomeschool/ui/widgets/my_app_bar.dart';
import 'package:appflutterhomeschool/view_model/academic_sentiment/answer_sheet_view_model.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

///用户： ninetailedfox
///时间： 2020/7/28
///邮箱： 1037438704@qq.com
///功能： 答题卡页面
class AnswerSheetPage extends StatelessWidget {
  final String id;

  AnswerSheetPage({this.id});

  @override
  Widget build(BuildContext context) {
    return ProviderWidget<AnswerSheetViewModel>(
      onModelReady: (value) => value.initView(),
      model: AnswerSheetViewModel(context, id),
      builder: (context, viewModel, child) {
        return Scaffold(
          appBar: MyAppBar2(title: "作业详情"),
          body: viewModel.systemQuestions == null
              ? Center(
                  child: CircularProgressIndicator(
                  backgroundColor: Colors.blue,
                ))
              : Column(
                  children: [
                    Container(
                      padding: EdgeInsets.all(ScreenUtil().setWidth(43)),
                      child: Row(
                        children: [
                          Expanded(
                              child: Text(
                            "答题情况",
                            style: TextStyles.textDark43,
                          )),
                          Container(
                            margin: EdgeInsets.only(left: 5, right: 5),
                            width: 15,
                            height: 15,
                            decoration: BoxDecoration(
                                color: Colors.blue,
                                borderRadius:
                                    BorderRadius.all(Radius.circular(15 / 2))),
                          ),
                          Text("答对", style: TextStyles.textGray33),
                          Container(
                            margin: EdgeInsets.only(left: 5, right: 5),
                            width: 15,
                            height: 15,
                            decoration: BoxDecoration(
                                color: Colors.red,
                                borderRadius:
                                    BorderRadius.all(Radius.circular(15 / 2))),
                          ),
                          Text("答错", style: TextStyles.textGray33),
                          Container(
                            margin: EdgeInsets.only(left: 5, right: 5),
                            width: 15,
                            height: 15,
                            decoration: BoxDecoration(
                                border:
                                    Border.all(width: 0.3, color: Colors.grey),
                                borderRadius:
                                    BorderRadius.all(Radius.circular(15 / 2))),
                          ),
                          Text("未作答", style: TextStyles.textGray33),
                        ],
                      ),
                    ),
                    Expanded(
                      child: GridView.builder(
                          shrinkWrap: true,
                          itemCount: viewModel.systemQuestions.length,
                          padding: EdgeInsets.symmetric(horizontal: 16),
                          gridDelegate:
                              SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 5,
                            mainAxisSpacing: ScreenUtil().setWidth(52),
                            crossAxisSpacing: ScreenUtil().setWidth(105),
                            childAspectRatio: 1,
                          ),
                          itemBuilder: (context, index) {
                            return GestureDetector(
                              onTap: () => Application().navigatePushToPage(
                                  context, Routes.answerDisplayPage, {
                                "pageTag": index,
                                "id": id,
                              }),
                              child: Container(
                                width: ScreenUtil().setWidth(104),
                                height: ScreenUtil().setWidth(104),
                                alignment: Alignment.center,
                                decoration: BoxDecoration(
                                    color: viewModel.systemQuestions[index]
                                        .switchColor(),
                                    borderRadius: BorderRadius.all(
                                        Radius.circular(
                                            ScreenUtil().setWidth(104)))),
                                child: Text(
                                  viewModel.systemQuestions[index]?.order ?? "",
                                  style: TextStyles.textWhite43,
                                ),
                              ),
                            );
                          }),
                    )
                  ],
                ),
        );
      },
    );
  }
}
